<style type="text/css"> 
.ui-tabs-vertical {}
.ui-tabs-vertical .ui-tabs-nav { padding: .2em .1em .2em .2em; float: left; width: 12em; }
.ui-tabs-vertical .ui-tabs-nav li { clear: left; width: 100%; border-bottom-width: 1px !important; border-right-width: 0 !important; margin: 0 -1px .2em 0; }
.ui-tabs-vertical .ui-tabs-nav li a { display:block; }
.ui-tabs-vertical .ui-tabs-nav li.ui-tabs-selected { padding-bottom: 0; padding-right: .1em; border-right-width: 1px; border-right-width: 1px; }
.ui-tabs-vertical .ui-tabs-panel { padding: 1em; float: left; width: 75%;}
	</style> 
<div id="tabsReportes"> 
	<ul>
		<li><a id="lnkInscritosGrupo">Inscritos por Grupo</a></li> 
		<li><a id="lnkCelulasPorLider">Células por lider</a></li> 
		<li><a id="lnkGenealogias">Genealogías</a></li>
	</ul>
</div>	 
<script language="JavaScript">
	$(document).ready(function(){
		$("#lnkInscritosGrupo").attr("href",utility.makeUrl("publics/loadInscritosView"));
		$("#lnkCelulasPorLider").attr("href",utility.makeUrl("publics/loadCelulasLiderView"));

		$("#tabsReportes li").removeClass('ui-corner-top').addClass('ui-corner-left');
		$("#tabsReportes").addClass('ui-tabs-vertical ui-helper-clearfix');
		
		$("#tabsReportes").tabs({
			cache:true,
			load: function(event, ui){
				var selected = $( "#tabs" ).tabs( "option", "selected" );
				$(".ajaxlink").attr("href","javascript:void(0);");
				if(selected==0){
					
				}
			},
			ajaxOptions: {
				error: function( xhr, status, index, anchor ) {
					$( anchor.hash ).html("Error de carga" );
				},
				dataFilter: function(result){
		            data = $.parseJSON(result);
					response = data.response;
		            return response.data;
		        }
			}
		});
	});
</script>